<template>
  <el-checkbox
    style="position: absolute; left: -2rem"
    v-if="showCheckbox"
    data-iframe-checkbox
    :data-checked-block-id="checkedId"
    :data-checked-content="checkedContent"
  ></el-checkbox>
</template>

<script>
import { isListTitle } from '@/constants/structure'
import { getValue } from '@/utils/plugins/itemlist/itemlistSetting'

export default {
  props: {
    itemlist: {
      type: Boolean,
      default: false
    },
    bulletItem: {
      type: Object,
      default: () => ({})
    },
    blockData: {
      type: Object,
      default: () => ({})
    }
  },
  computed: {
    dataType() {
      return this.blockData.dataType
    },
    isIframe() {
      return this.$store.getters._iframe
    },
    isBlock() {
      return ['table', 'figure', 'formula'].includes(this.dataType)
    },
    showCheckbox() {
      return this.isIframe && (isListTitle(this.dataType) || this.isBlock || this.itemlist)
    },
    checkedId() {
      return this.itemlist ? this.bulletItem.textData.dataId : this.blockData.blockId
    },
    checkedContent() {
      if (/item[1-4]/g.test(this.dataType)) {
        return `第${this.blockData.blockIndex}条`
      }
      if (isListTitle(this.dataType)) {
        return `第${this.blockData.blockIndex}章`
      }
      if (this.dataType === 'table') {
        return `表${this.blockData.tableData.tableNumber}`
      }
      if (this.dataType === 'figure') {
        return `图${this.blockData.figureData.figureNumber}`
      }
      if (this.dataType === 'formula') {
        return `公式${this.blockData.formulaData.formulaNumber}`
      }
      if (this.dataType === 'item_list') {
        return `列项${this.bulletItem.levelNum
          .split('.')
          .map((o, i) => getValue(i + 1, parseInt(o) || 1))
          .join('-')}`
      }
      return ''
    }
  }
}
</script>
